import { Component, ViewEncapsulation, ChangeDetectionStrategy } from '@angular/core';

@Component({
  selector: 'app-disabled-date-time',
  templateUrl: './disabled-date-time.component.html',
  encapsulation: ViewEncapsulation.None,
  changeDetection: ChangeDetectionStrategy.OnPush,
})
export class DisabledDateTimeComponent {
  date: Date = new Date();
  rangeDate = [new Date('2020-06-10'), new Date('2020-12-20')];
  tag = '';

  disabledDate = (date: Date): boolean => {
    const today = new Date();
    const endOfDay = new Date(today.getFullYear(), today.getMonth(), today.getDate(), 23, 59, 59);
    return date > endOfDay;
  };

  showTime = {
    format: 'HH:mm:ss',
    disabledHour: (hour: number): boolean => hour < 5 || hour > 18,
    disabledMinute: (hour: number, minute: number): boolean => hour == 8 && minute < 30,
    disabledSecond: (hour: number, minute: number, second: number): boolean => minute < 30 && second > 30,
  };

  disabledDateRange = (date: { getTime: () => number }, selectedDate: any[], tag: string): boolean => {
    if (tag === 'end' && selectedDate[0]) {
      const _t = new Date(selectedDate[0].setFullYear(Number(selectedDate[0].getFullYear() + 1)));
      return selectedDate[0] && date.getTime() > _t.getTime() ? true : false;
    } else {
      return false;
    }
  };

  showRangeTime = {
    disabledHour: (hour: number, tag: string): boolean => {
      if (tag === 'start') {
        return hour < 5 || hour > 18;
      } else {
        return hour > 6 && hour < 20;
      }
    },
    disabledMinute: (hour: number, minute: number): boolean => minute < 10 || minute > 50,
    disabledSecond: (hour: number, minute: number, second: number): boolean => minute < 30 && second > 30,
  };

  rangeTagChange(e: string): void {
    this.tag = e;
  }
}
